<template>
  <component :is="component"></component>
</template>

<script>
import Vue from 'vue'
import { coder } from '@daelui/dogjs/dist/components'
import defaults from './default.js'

export default {
  props: {
    value: {
      type: Object,
      default () {
        return {
          code: defaults.code
        }
      }
    }
  },

  data () {
    return {
      component: 'div'
    }
  },

  watch: {
    value: {
      handler () {
        this.compile()
      },
      deep: true
    }
  },

  methods: {
    compile () {
      coder.vue.resolve(this.value.code || defaults.code, Vue, $pig).then(cp => {
        this.component = cp
      })
    }
  },

  created () {
    this.compile()
  }
}
</script>

<style lang="less">
</style>
